<template>
  <div class="model-title-common">
    <div class="common-start">
      <div style="color: #1e89ff; cursor: pointer" @click="back">
        <a-space :size="8">
          <icon-left />
          <span>返回</span>
        </a-space>
      </div>
      <a-divider direction="vertical" />
      <span>{{ props.title }}</span>
    </div>
    <slot name="btn" />
  </div>
</template>

<script lang="ts" setup>
  import { defineProps, defineEmits } from 'vue';

  const emit = defineEmits(['closed']);
  const back = () => {
    emit('closed');
  };
  const props = defineProps({
    title: {
      type: String,
      default: '',
    },
  });
</script>

<style lang="less" scoped>
  .model-title-common {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;

    .common-start {
      display: flex;
      align-items: center;
    }
  }
</style>
